<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<%String contextRoot = request.getContextPath();%>
<f:loadBundle basename="properties.messages" var="msg"/>
<f:view>
<!doctype html>
<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <title>SISDEP : Sistema de Informaci<h:outputText value="#{msg.tilde_o}" />n de Espacio P<h:outputText value="#{msg.tilde_u}" />blico</title>
	<meta name="description" content="" />
	<meta name="author" content="" />		     
	<link rel="stylesheet" href="<%=contextRoot%>/css/validationEngine.jquery.css" type="text/css">
	<link rel="stylesheet" href="<%=contextRoot%>/css/template.css" type="text/css">
	<link rel="stylesheet" href="<%=contextRoot%>/css/normalize.css">
	<link rel="stylesheet" href="<%=contextRoot%>/css/uniform.css"> <!-- estilos formularios -->
	<link rel="stylesheet" href="<%=contextRoot%>/css/cuerpo.css">	
	<link rel="stylesheet" href="<%=contextRoot%>/css/richCustom.css">	
</head>
<body>
<div id="marco"> <!--inicio contenedor --> 
<div class="arriba-cuerpo"></div> 
<div class="cuerpo">
<a href="<%=contextRoot%>/index.jsf"><img src="<%= contextRoot %>/images/logos.png" /></a>
<div class="clear"></div>
<!-- Menu y Usuario init() -->
	<%@ include file="include/menuUsuario.jsp" %>
<!-- Menu y Usuario end() -->
<div class="clear"></div>
<!-- Formulario --> 
<div id="buscador">
<h2>Consulta de Operativos</h2>
	<h:form id="operativoSearchForm">  
		<span class="left" style="margin-left:0px">
		<label>Servicio o Cuadrante</label>
			<h:selectOneMenu id="square" 
							value="#{operativoController.operativoSearch.cuadrante}">
		
		        <f:selectItem itemLabel="Seleccione..." itemValue=""/>
		        <f:selectItems value="#{masterListCache.squareList}"/>
		    </h:selectOneMenu>
		</span>
		<span class="left" style="margin-left:30px">
		<label>Coordinador Encargado</label>
			<h:selectOneMenu id="coordinador" 
							value="#{operativoController.operativoSearch.coordinador}">
		
		        <f:selectItem itemLabel="Seleccione..." itemValue=""/>
		        <f:selectItems value="#{operativoController.recursoHumanoList}"/>
		    </h:selectOneMenu>
		</span>
		
		<div class="clear" style="margin-left: 400px;"></div>
		<br/>
		
		<span class="left" style="margin-left:0px">
		<label>Tipo de Operativo</label>
			<h:selectOneMenu id="operativeType" 
							value="#{operativoController.operativoSearch.idTipoOperativo}">
		
		        <f:selectItem itemLabel="Seleccione..." itemValue=""/>
		        <f:selectItems value="#{masterListCache.operativeType}"/>
		    </h:selectOneMenu>
		</span>
		<span class="left" style="margin-left:30px">
		<label>Fecha Operativo Inicial</label>
		 	<h:inputText id="initialDate" styleClass="validate[custom[date]] initialDate" size="10" maxlength="10"
					value="#{operativoController.operativoSearch.initDate}">
			</h:inputText>
		</span>
		<span class="left" style="margin-left:30px">
		<label>Fecha Operativo Final</label>
			<h:inputText id="endDate" styleClass="validate[custom[date]] endDate" size="10" maxlength="10"
					value="#{operativoController.operativoSearch.endDate}">
			</h:inputText>
		</span>
		
		<div class="clear" style="margin-left: 400px;"></div>
		<br/>
		
		<span class="left" style="margin-left:0px">
		<label>Estado de Operativo</label>
			<h:selectOneMenu id="operativeStatus" 
							value="#{operativoController.operativoSearch.estado}">
		
		        <f:selectItem itemLabel="Seleccione..." itemValue=""/>
		        <f:selectItems value="#{operativoController.operativoStatusList}"/>
		    </h:selectOneMenu>
		</span>
		<br/>
		<div class="clear">(<span class="asterisco"> * </span>) : Campo Obligatorio.</div>
		<br/>
		<div class="clear"></div>
		
		<span class="botones right">
			<h:commandButton id="regReportGenerateButton"
						 type="submit" 
		                 value="Buscar" 
		                 ondblclick="return false;" 
		                 styleClass="buscador form button" 
           				 action="#{operativoController.getOperativoListByParameters}" >
			</h:commandButton>
		</span>
		
		<span class="left">
	    	<h:commandButton id="createoperativoButton"
				 styleClass="botonsmall"
                   type="submit" 
                   value="Nuevo" 
                   ondblclick="return false;" 
                   action="#{operativoController.manageCreate}" >
            </h:commandButton>
        </span>
	</h:form>
</div>
<!-- Fin formulario -->
 <br/>
<div id="buscador">
	<span class="left"><h2>Resultados de la Consulta de Operativos:</h2></span>
</div>
 <br/>
<h:form id="operativoResultsForm">

<div style="overflow-x: scroll; position: relative; width: 670px;">
 
	  <rich:dataTable id="operativoData" headerClass="standardTable_Header"
                border="0" cellpadding="3" cellspacing="1" 
                footerClass="standardTable_Header" rowKeyVar="rowIndex"
              		rowClasses="tablamultiregistrotr1,tablamultiregistrotr2"
              		onRowMouseOver="this.style.backgroundColor='#C0C0C0'"
	          	onRowMouseOut="this.style.backgroundColor='#FFFFFF'"
                var="operativoRow" value="#{operativoController.operativoListModel}"
                rows="10" >
           <h:column>
               <f:facet name="header"><h:outputText value="Editar" /></f:facet>
                   <a4j:commandLink id="updateOperativo" styleClass="formTextLink" title="Editar"				                                   
                                  action="#{operativoController.manageUpdate}" reRender="groupTable">
                       <f:param name="operativoDataIndex" value="#{rowIndex}" />
                       <h:graphicImage value="/images/edit_icon.png" style="border: 0px solid #FFFFFF;" />
                   </a4j:commandLink>
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Cuadrante" /></f:facet>
               <h:outputText value="#{operativoRow.cuadranteStr}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Coordinador" /></f:facet>
               <h:outputText value="#{operativoRow.coordinadorStr}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Tipo Operativo" /></f:facet>
               <h:outputText value="#{operativoRow.tipoOperativoStr}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Fecha" /></f:facet>
               <h:outputText value="#{operativoRow.fechaOperativoStr}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Turno" /></f:facet>
               <h:outputText value="#{operativoRow.turno}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Direccion" /></f:facet>
               <h:outputText value="#{operativoRow.direccionOperativo}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Descripcion" /></f:facet>
               <h:outputText value="#{operativoRow.descripcion}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Estado" /></f:facet>
               <h:outputText value="#{operativoRow.estado}" />
           </h:column>
           <h:column>
               <f:facet name="header" ><h:outputText value="Metros Recuperados" /></f:facet>
               <h:outputText value="#{operativoRow.metrosRecuperados}" />
           </h:column>
        </rich:dataTable>
        <h:panelGrid columns="1" styleClass="tablapaginacion"
                           columnClasses="standardTable_ColumnCentered" >
            <rich:datascroller id="operativoScroll"
                    for="operativoData"
                    fastStep="10"
                    pageIndexVar="pageIndex"
                    styleClass="scroller"
                    maxPages="9" >
                <f:facet name="first" >
                    <h:graphicImage url="/images/arrow-first.gif" />
                </f:facet>
                <f:facet name="last">
                    <h:graphicImage url="/images/arrow-last.gif" />
                </f:facet>
                <f:facet name="previous">
                    <h:graphicImage url="/images/arrow-previous.gif" />
                </f:facet>
                <f:facet name="next">
                    <h:graphicImage url="/images/arrow-next.gif" />
                </f:facet>
                <f:facet name="fastforward">
                    <h:graphicImage url="/images/arrow-ff.gif" />
                </f:facet>
                <f:facet name="fastrewind">
                    <h:graphicImage url="/images/arrow-fr.gif" />
                </f:facet>
            </rich:datascroller>
        </h:panelGrid>
	</div>
	<br/>
    <div class="clear"></div>
    <span class="botones right">
		<h:commandButton id="opeReportGenerateButton"
					 type="submit" 
	                 value="Generar Reporte" 
	                 ondblclick="return false;" 
	                 styleClass="buscador form button"
	                 onclick="exportToXLS();" >
		</h:commandButton>
	</span>
	<br/>
   </h:form>
</div>
<div class="abajo-cuerpo"></div> 
</div> <!-- Fin contenedor -->
<div class="footer"></div>
<script src="<%=contextRoot%>/js/jquery/lib/jquery-1.7.2.min.js"></script><!-- De ser 1ro -->
<script src="<%=contextRoot%>/js/script.js" type="text/javascript"></script><!-- De ser 2do -->
<script src="<%=contextRoot%>/js/jquery/lib/jquery.uniform.min.js"></script> <!-- formularios --> 
<script src="<%=contextRoot%>/js/jquery/lib/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
<script src="<%=contextRoot%>/js/jquery/lib/jquery.validationEngine-es.js" type="text/javascript" charset="utf-8"></script>
<script src="<%=contextRoot%>/js/jquery.maskedinput-1.3.js" type="text/javascript"></script> <!-- Quitar si no se usan fechas -->
<script src="<%=contextRoot%>/js/sisdep.js" type="text/javascript"></script> <!-- Quitar si no se usan funciones custom -->
<script type="text/javascript">
	jQ(document).ready(function() {
		jQ("input, select, input:checkbox, input:radio, input:file").uniform();
		jQ("#operativoSearchForm").validationEngine('attach');
		jQ("#operativoSearchForm").bind("jqv.form.result", function(event, errorFound) {
	        if(!errorFound) displayLoadingImage();
	    });
	
		jQ(".initialDate").mask("99/99/9999");
		jQ(".endDate").mask("99/99/9999");
	});

	function exportToXLS() { 
		showReportPopup('<%= contextRoot %>/reportController.view?format=xls&reportName=reporteOperativosXLS');
	}
	
	/**
	 * Funcion JS que permite invocar el servlet de generacion de reportes y presentar una ventana independiente
	 * para su descarga.
	 * 
	 * @author carlos.perez@consult-soft.com
	 * @param servletReporterURL
	 */
	function showReportPopup(servletReporterURL){
	    window.open(servletReporterURL, "reportStandardPopup",
	                "toolbar=0,location=0,scrollbars=1,directories=0,status=0,menubar=0,resizable=1,width="+550+",height="+550+",left="+(screen.width-550)/2+",top="+(screen.height-550)/2);
	}
</script>
<%@ include file="include/validationStatus.jsp" %>
<%@ include file="include/modalMessageWindow.jsp" %>	
</body>
</html>
</f:view>
